<template>
    <view class="h-[104rpx] w-[100vw] flex justify-around items-center bg-white fixed bottom-0 z-[9999]" :style="{paddingBottom:iosHight+'rpx',height:(104+iosHight)+'rpx'}">
        <view @click="changeItem(item)" class="flex items-center" v-for="(item, index) in tabbarList" :key="index">
            <image v-if="item.isUrl" :src="item.url" class="h-[90rpx] w-[90rpx]"></image>
            <view v-else :class="currentItem==item.id?'text-[#FD755D]':'text-[#3D3D3D]'" class=" font-medium">{{ item.text }}</view>
        </view>
    </view>
</template>
<script setup>
import {
    defineProps,
    onMounted,
    ref
} from "vue"
const props = defineProps({
    currentPage: {
        type: Number,
        default: 0
    }
})
const scanCode = ()=>{
    
}
const currentItem = ref(0);
const iosHight = ref(0)//适应ios底部导航栏高度
const tabbarList = ref([{
    id: 0,
    path: '/pages/index/index',
    isUrl: false,
    text: '首页',
    selectColor: "#FD755D",
    centerItem: false
},
{
    id: 1,
    path: '/pages/enquiry/enquiry',
    isUrl: true,

    url: "https://gangantao.com/image/20241216/bbb2472b-21fb-4fe8-bf25-449a93d97a2b.png",
    text: '问询',
    centerItem: true
},
{
    id: 2,
    path: '/pages/my/my',
    text: '我的',
    selectColor: "#FD755D",
    isUrl: false,
    centerItem: false
}
]);

const changeItem = (item)=> {
    if(item.url){
       return  uni.scanCode({})
    }
    uni.switchTab({
        url: item.path
    });
}

onMounted(() => {
    currentItem.value = props.currentPage;

});
const systemInfo = uni.getSystemInfoSync();
if (systemInfo.platform === 'ios') {
    iosHight.value=50
} else {
    iosHight.value=0
}
</script>
